<!DOCTYPE html>
<html xmlns=http://www.w3.org/1999/xhtml xmlns:bd=http://www.baidu.com/2010/xbdml>
<head>

    <title>全部消息</title>
    <meta http-equiv="Content-Type" content="text/html" charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <link rel="stylesheet" href="/pc/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="/pc/layout/css/font_eolqem241z66flxr.css" media="all" />
    <link rel="stylesheet" href="/pc/layout/css/news.css" media="all" />
</head>
<body class="childrenBody">
<blockquote class="layui-elem-quote" style="margin-top:1.2em;">
    <form action="" method="get">
        <div class="layui-inline">
    @if($areaids ==="0")
        <div class="layui-input-inline" style="margin-top: 5px;margin-right: 20px; ">            
           <label class="layui-form-label" style="padding: 0;width: 66px;margin-top: 1px;height: 36.4px;background: #E5E5E5;text-align: center;line-height: 36.4px;">代理商</label>
            <select name="agent_id" lay-verify="" class="layui-input search_input"  style="width: 12em">
                @if(!null == $agname)
                @foreach($agname as $v)
                    <option value="{{$v['id']}}" @if(isset($request['agent_id'])) @if($request['agent_id'] == $v['id']) selected @endif @endif >{{ $v['name'] }}</option>
                @endforeach
                @endif
            </select> 
        </div>
    @endif
        <div class="layui-input-inline" style="margin-top: 5px; margin-right: 20px; ">        
            <label class="layui-form-label" style="padding: 0;width: 66px;margin-top: 1px;height: 36.4px;background: #E5E5E5;text-align: center;line-height: 36.4px;">报警类型</label>
            <input type="text" name="genre" value="" placeholder="请输入类型" class="layui-input search_input" style="width: 12em">
        </div>
         <div class="layui-input-inline" style="margin-top: 5px; margin-right: 20px; ">
            <label class="layui-form-label" style="padding: 0;width: 66px;margin-top: 1px;height: 36.4px;background: #E5E5E5;text-align: center;line-height: 36.4px;">DEVEUI</label>
            <input type="text" value="" name="DevEUI" placeholder="请输入DEVEUI" class="layui-input search_input" style="width: 12em">
        </div>
         <div class="layui-input-inline" style="margin-top: 5px; margin-right: 20px; ">
            <label class="layui-form-label" style="padding: 0;width: 66px;margin-top: 1px;height: 36.4px;background: #E5E5E5;text-align: center;line-height: 36.4px;">编号</label>
            <input type="text" value="" name="num" placeholder="请输入编号" class="layui-input search_input" style="width: 12em">
        </div>
        <div class="layui-input-inline" style="margin-top: 5px;margin-right: 20px; ">
            <label class="layui-form-label" style="padding: 0;width: 66px;margin-top: 1px;height: 36.4px;background: #E5E5E5;text-align: center;line-height: 36.4px;">时间范围</label>
            <div class="layui-input-inline">
                <input class="layui-input" value="" name="ftime" placeholder="开始日" id="LAY_demorange_s">
            </div>
            <div class="layui-input-inline">
                <input class="layui-input" value="" name="ltime" placeholder="截止日" id="LAY_demorange_e">
            </div>
        </div>
        <input type="submit" class="layui-btn search_btn" value="查询" style="margin-top: 5px;">
    </div>
    </form>

</blockquote>

<div class="layui-form news_list">
    {{ csrf_field() }}
    <table class="layui-table">
        <thead>
        <tr>
            <th style="text-align: center">时间</th>
            <th style="text-align: center">设备编号</th>
            <th style="text-align: center">verifyCode</th>
            <th style="text-align: center">区域</th>
            <th style="text-align: center">房间</th>
            <th style="text-align: center">位置</th>
            <th style="text-align: center">应用</th>
            <th style="text-align: center">报警类型</th>
            <th style="text-align: center">区域负责人</th>
        </tr>
        </thead>

        <tbody class="news_content" id="info">
        @if($data)
            @foreach($data as $v)
                <tr >
                    <td>{{date('Y-m-d H:i:s',$v['addTime'])}}</td>
                    <td>{{$v['num']}}</td>
                    <td>{{$v['verifyCode']}}</td>
                    <td>{{$v['aname']}}</td>
                    <td>{{$v['rname']}}</td>
                    <td>{{$v['loc']}}</td>
                    <td>{{$v['type_name']}}</td>
                    <td>{{$v['genre']}}</td>
                    <td>{{$v['staffs']}}</td>
                </tr>
            @endforeach
        @endif
        <input type="hidden" id="page" value="{{$get['page']}}">
        </tbody>
    </table>
</div>
@if(!null == $data)
<div style="float:right;">
    {!! $data->appends($request)->render() !!}  
</div>
@endif
<script src="/pc/layout/js/jquery.min.js"></script>
<script type="text/javascript" src="/pc/layui/layui.js"></script>
<script type="text/javascript" src="/pc/info/js/socket.io.js"></script>
<script type="text/javascript">
    layui.use('laydate', function(){
      var laydate = layui.laydate;

      var start = {
        // min: laydate.now()
         min:  '2000-06-16 23:59:59'
        ,max: '2099-06-16 23:59:59'
        ,istoday: false
        ,choose: function(datas){
          end.min = datas; //开始日选好后，重置结束日的最小日期
          end.start = datas //将结束日的初始值设定为开始日
        }
      };

      var end = {
        min: '2000-06-16 23:59:59'
        ,max: '2099-06-16 23:59:59'
        ,istoday: false
        ,choose: function(datas){
          start.max = datas; //结束日选好后，重置开始日的最大日期
        }
      };

      document.getElementById('LAY_demorange_s').onclick = function(){
        start.elem = this;
        laydate(start);
      }
      document.getElementById('LAY_demorange_e').onclick = function(){
        end.elem = this
        laydate(end);
      }
});

    var page = $('#page').val();
    //websocket
    var socket = io('http://af.iqykj.com:2120');
    uid="af";
    socket.on('connect',function(){
        socket.emit('login',uid);
    });
    // 接收信息
    socket.on('new_msg',function(data){
        $.ajax({
            url:'/admin/info/fresh',
            type:'post',
            async:false,
            data:{
                "_token": $("input[name=_token]").val(),
                'page':page
            },
            dataType:'json',
            success:function (data) {
                console.log(data)
                var str = '';
                for(var i=0;i<data.length;i++){
                    str += "<tr><td>"+getMyDate(data[i]['addTime']*1000)+"</td><td>"+data[i]['num']+"</td> <td>"+data[i]['verifyCode']+"</td> <td>"+data[i]['aname']+"</td> <td>"+data[i]['rname']+"</td> <td>"+data[i]['loc']+"</td> <td>"+data[i]['type_name']+"</td> <td>"+data[i]['genre']+"</td> <td>"+data[i]['staffs']+"</td> </tr>";
                }
                $('#info').empty();
                $('#info').append(str)
            }
        });
    });
    function getMyDate(str){
        var oDate = new Date(str),
            oYear = oDate.getFullYear(),
            oMonth = oDate.getMonth()+1,
            oDay = oDate.getDate(),
            oHour = oDate.getHours(),
            oMin = oDate.getMinutes(),
            oSen = oDate.getSeconds(),
            oTime = oYear +'-'+ getzf(oMonth) +'-'+ getzf(oDay) +' '+ getzf(oHour) +':'+ getzf(oMin) +':'+getzf(oSen);//最后拼接时间
        return oTime;
    };
    //补0操作
    function getzf(num){
        if(parseInt(num) < 10){
            num = '0'+num;
        }
        return num;
    }
</script>
</body>
</html>
